<template>
    <div class="boy">
        <van-tabs v-model="active" v-if="topList.length != 0">
            <van-tab v-for="(item,i) in topList" :key="i" :title="item.name">
                <contBox :typeId="item.id"/>
            </van-tab>
        </van-tabs>
    </div>
</template>

<script>
    import contBox from '@/components/ContBox.vue'
    export default {
        name:'boy',
        components:{
            contBox
        },
        data() {
            return {
                //头部列表
                topList:[],
                //列表选中下标
                active:0
            }
        },
        created(){
            this.axios({
                url:'GetClassPageLayout',
                params:{
                    tabId:263
                }
            }).then((res)=>{
                if (res.status === 200) {
                    this.topList = res.data.data.layout
                }
            }).catch(err =>{
                
            })
        }
    }
</script>

<style lang="less" scoped>
    .boy{
        width: 100%;
        height: calc(100vh - 94px);
        overflow-y: scroll;
        /deep/.van-tabs--line .van-tabs__wrap{
            height: 30px;
        }
        /deep/.van-tabs__nav .van-tab{
            font-size: 12px;
            padding: 0 6px;
        }
        /deep/.van-tabs__nav .van-tab--active{
            font-size: 14px;
        }
        /deep/.van-tabs__nav .van-tabs__line{
         opacity: 1;
         width: 15px;
         height: 2px;
        }
    }
</style>